<!-- 已付款 -->
<template>
    <div class="page-box h100 display-flex czbj">
      <p class="title-label mb10">已付款</p>
      <dxtable
        :dataJson="dataJson"
        :portUrl="portUrl"
        :formJson="formJson"
        :qx="qx"
        ref="databale"
        :czFun="czFun"
      ></dxtable>
      <n-modal v-model:show="showModal" preset="card" class="Stock-diagnosis">
      <template #header>
      <div>分成</div>
      </template>
      <div>
        <n-table :single-line="false">
    <thead>
      <tr>
        <th>分销等级</th>
        <th>应分成ID</th>
        <th>应分成姓名</th>
        <th>应分成邮箱</th>
        <th>会员等级</th>
        <th>分成金额</th>
     
      </tr>
    </thead>
    <tbody>
      <tr v-for="sd in jdfsddf">
        <td>{{ sd.fxdj }}</td>
        <td>{{ sd.id }}</td>
        <td>{{ sd.name }}</td>
        <td>{{ sd.email }}</td>
        <td>{{ sd.dengji }}</td>
        <td>{{ jsdfsdf(sd.bilie )}}</td>
       
      </tr>
      <tr>
        <td   colspan="5">
          <div class="tr">
            应分总额
          </div>
        </td>
        <td>{{ hnhjsdfds(jdfsddf) }}</td>
      </tr>
    </tbody>
  </n-table>
  <div v-if="jdfsddf.length<=0" class="vertical-center pt30 pm30">
    <div>
      <img src="../../../assets/img/noData.png" style="width: 120px;">
    <p>此账号没有上级</p>
    </div>
  </div>
      </div>
      <template #action>
      <div class="tr">
        <n-button type="info" v-if="jdfsddf.length>0&&rowData.fczhuangt==1" :loading="jdfswesd" @click="fenxiaosd"> 确认 </n-button>
      <n-button @click="showModal=false" class="ml20"> 取消 </n-button>
      </div>
      </template>
      </n-modal>
    </div>
  </template>
  <script lang="ts" setup>
  import { Options } from "@vicons/ionicons5";
import dxtable from "../../../components/util/dxtable.vue";
  import sort from "../../../components/util/sort.vue";
  import { dxget, dxpost } from "../../../util/index";
  import { NButton, NImage, NTag } from "naive-ui";
  import { h, ref, reactive, render } from "vue";
  const databale = ref();
  const showModal = ref(false);
  const jdfsddf = ref([])
  const rowData = ref({})
  const shhehsdrt = ref();
  const hjshsd = ref()
  const jdfswesd = ref(false)
  const initeer = () => {
    databale.value.initDataExpose();
  };
  const shjjseft = ref("1");
  let zhidfds = [
    {
      label:"微信",
      value:"1"
    },{
      label:"支付宝",
      value:"2"
    },{
      label:"平台币",
      value:"3"
    }
  ]
  let dataJson = [
  
  {
      title: "订单编号",
      key: "ddON",
      width:"180"
    },
    {
      title: "课程名称",
      key: "c.title",
      "search": true,
      render(row){
        return row.jstitle
      }
    },
    {
      title: "金额",
      key: "jiner",
    },
    {
    title: "支付方式",
    key: "zhifuqd",
    type:"select",
    options:[{
      label:"全部",
      value:""
    },...zhidfds],
    "search": true,
    render(row) {
      let ksdfsd = "--"
      if(row.zhifuqd==1){
        ksdfsd="微信"
      }
      if(row.zhifuqd==2){
         ksdfsd="支付宝"
      }
      if(row.zhifuqd==3){
        ksdfsd="平台币"
      }
      return ksdfsd
    }
  },
    {
      title: "购买人姓名",
      key: "b.name",
      "search": true,
      render(row){
        return row.uname
      }
    },
    {
      title: "电话",
      key: "uphone",
    },
    {
      title: "购买时间",
      key: "addTime",
      width: 150,
    },{
      title: "分成状态",
      key: "fczhuangt",
      width: 150,
      "search": true,
      type:"select",
      options:[{
      label:"全部",
      value:""
    },{
      label:"待分成",
      value:"1"
    },{
      label:"已分成",
      value:"2"
    },],
      render(row){
        if(row.fczhuangt==1||!row.fczhuangt){
          return h("span",{class:"z9"},"待分成")
        }
        if(row.fczhuangt==2){
          return h("span",{class:"red"},"已分成")
        }
      }
    },
  ];
  
  const qx = {
    DeletePermissionID: "23456", //删除
    EditPermissionIdentifier: "23456", // 编辑
    NewPermissionIdentifier: "23456", // 新建
    ViewPermissionID: "23456", // 查看
  };
  const portUrl = "jyc/dingdanzhuangtai/dingdanzhuangtai?type=1&state=2";
  
  let formJson = reactive([]);
  // 获取字典内容
  // const xtgxxmfl = async () => {
  //   const { data }: any = await dxget("dxgjAdmin/getzd", { name: 'xtgxxmfl' })
  //   dataJson[2].options = [
  //     {
  //       label: "全部",
  //       value: ""
  //     },
  //     ...data
  //   ]
  //   formJson[2].options = data
  //   xmlxSelect.value = data
  //   console.log(data);
  // }
  // xtgxxmfl()
  const czFun = {
    fun: (row) => {
      return [
        h(
          NButton,
          {
            type: "info",
            quaternary: true,
            onClick: async (e) => {
              rowData.value = row
              fdnnsd(row.uid)
            },
          },
          row.fczhuangt==1?"分成":'查看分成明细'
        ),
      ];
    },
  };
  const fdnnsd  = async(uid)=>{
    showModal.value = true
    const {data} = await dxget("jyc/api/getfenclist?zd=477,478",{uid})
    const jdfds =  Object.values(data);
    console.log(jdfds);
    jdfsddf.value = jdfds
  }
  const jsdfsdf = (sdd)=>{
    console.log(rowData.value);
    try{
      let kjjdfsd = (rowData.value.jiner*sdd).toFixed(2)
      return `订单金额(${rowData.value.jiner})*比列(${sdd*100}%)=${kjjdfsd}`
    }catch(e){
      return '--'
    }
    return '--'
  }

  const fenxiaosd = async()=>{
    jdfswesd.value = true
    const {data} = await dxpost("jyc/api/shoudongchufa",{
      zd:'477,478',
      uid:rowData.value.uid,
      jiner:rowData.value.jiner,
      beizhu:"课程分成"
    })
    await dxpost('jyc/dingdanzhuangtai/dingdanzhuangtai',{id:rowData.value.id,fczhuangt:2},"put")
    jdfswesd.value = false
    initeer()
    showModal.value = false
  }
  const hnhjsdfds =(data)=>{
    let jdfds = 0
    data.map(a=>{
      let jsdfs  = parseFloat(rowData.value.jiner*a.bilie)
      jdfds+= jsdfs
    })
    return jdfds.toFixed(2)
  }
  </script>
  <style scoped></style>
  <style>
  .dfdsrtyrytyt {
    width: 400px;
  }
  </style>
  